<!DOCTYPE html>
<html>
<head>
    <meta charset="UTF-8">
    <title>模拟交易</title>
    <base id="base" href="${basePath}">
    <script src="js/base.js"></script>
    <link rel="stylesheet" type="text/css" href="css/index.css"/>
    <script src="js/trades/mock_trade.js"></script>
</head>
<style type="text/css">
    .r15 {
        right: 15px;
    }

    .c80 {
        color: #E1B080;
    }

    .logo {
        width: 27px;
        height: 35px;
        top: 6px;
    }

    .logo img {
        width: 100%;
        height: 100%;
    }

    .yst {
        position: relative;
    }

    .jbsr {
        background: linear-gradient(to right, rgba(29, 30, 35, 1) 0%, rgba(6, 177, 50, 0.15)) !important;
        color: #06B132 !important;
    }

    .jbsg {
        background: linear-gradient(to right, rgba(29, 30, 35, 1) 0%, rgba(230, 0, 32, 0.15));
        color: #E60020;
    }

    .kbd {
        width: 100%;
        height: 12%;
    }

    .national {
        width: 100%;
        height: 46px;
        padding: 10px 15px;
        box-sizing: border-box;
        background-color: #424242;
        position: fixed;
        top: 0px;
        left: 0px;
        z-index: 22;
    }

    .fix, .fix1 {
        width: 100%;
        position: fixed;
        top: 45px;
        left: 0px;
        z-index: 22;
    }

    .fix1 {
        background: #1d1e23;
        height: 1%;
        width: 100%;
        z-index: 21;
    }

    /*.cgree{color: #06B132;}*/
</style>
<body ms-controller="root">

    <div class="headbar color_ef tc f18" style="position: fixed;">模拟交易&nbsp;
        <span class="f12"><a class="colorccc" href="trade/monijiaoyi">模拟持仓</a></span>
        <span class="left_arrow bgBox" id="left_"></span>
        <span class="jiesuan f14" onClick="location.href='trade/moni_market'">编辑</span>
    </div>

<div class="fix1"></div>
<div class="list_title f12 hidden color999 mt5 fix">
    <div class="item_name fl w50">交易品种</div>
    <div class="item_name fl w25 tr">最新价</div>
    <div class="item_name fl w25 tr">涨跌幅
        <span class="updown inline_block uppic" ms-class-downpic="isup" ms-click="chooseup"></span>
    </div>
</div>

<div class="kbd"></div>
    <#list products as product>
            <div class="markets markets-a hidden" row-code="${product.code}" ms-class-jbsg="${product.changeCount}<0"
                 ms-class-jbsr="${product.changeCount}>0">
                <div class="fl w50">
                    <div class="f18 color_ef"><span
                            class="markets_span inline_block bgcolor_red f10 mr8">${product.exchange}</span>${product.name}
                    </div>
                    <div class="mt5 f10 colorccc"><span class="markets_span inline_block bgcolor_blu f10 mr8">主</span>
                        <#if product.code == 'SCau0001'>
                                AU1812
                        </#if>
                        <#if product.code == 'SCag0001'>
                                AG1812
                        </#if>
                        <#if product.code == 'SCcu0001'>
                                CU1807
                        </#if>
                        <#if product.code == 'DCp0001'>
                                P1809
                        </#if>
                        <#if product.code == 'SCrb0001'>
                                RB1810
                        </#if>
                        <#if product.code == 'DCi0001'>
                                I1809
                        </#if>
                        <#if product.code == 'ZCSR0001'>
                                SR1809
                        </#if>
                        <#if product.code == 'SCru0001'>
                                RU1809
                        </#if>
                        <#if product.code == 'SEsc0001'>
                                SC1809
                        </#if>
                        <#if product.code == 'CMGCA0'>
                                GC1806
                        </#if>
                        <#if product.code == 'CMHGA0'>
                                HG1807
                        </#if>
                        <#if product.code == 'NENGA0'>
                                NG1806
                        </#if>
                        <#if product.code == 'CENQA0'>
                                NQ1806
                        </#if>
                        <#if product.code == 'CEYMA0'>
                                YM1806
                        </#if>
                        <#if product.code == 'NECLA0'>
                                CL1806
                        </#if>
                    </div>
                </div>
                <div class="markets_num w25 fl f18 tr cgree" id="lastPrice-${product.code}"
                     onchange="">${product.lastPrice}</div>
                <div class="markets_num w25 fl f18 tr cgree" id="changeCount-${product.code}">${product.changeCount}%
                </div>
            </div>
    </#list>
<script>
    var isDomestic = '${RequestParameters["isDomestic"]}';
    $(function () {
        $(".markets-a").click(function () {
            window.location.href = 'trade/product?code=' + $(this).attr("row-code");
        });
        setInterval("changeIndexData();", 1000);
    });

    function changeIndexData() {
        $.get("trade/getIndexData", {"isDomestic": isDomestic}, function (data) {
            data.forEach(function (val, i, arr) {
                $("#lastPrice-" + val.code).html(val.lastPrice);
                $("#changeCount-" + val.code).html(val.changeCount + "%");
            });
        });
    }
</script>
</body>
</html>